<template>
  <a-spin :spinning="confirmLoading">
    <!-- 主表单区域 -->
    <div>
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-row>
          <a-col :span="8">
            <a-form-model-item label="公司名称" :labelCol="labelCol3" :wrapperCol="wrapperCol3" prop="companyName">
             <j-dict-select-tag v-model="model.companyName" dictCode="companys" placeholder="请选择"
               />
            </a-form-model-item>
          </a-col>
           <a-col :span="8">
            <a-form-model-item label="支出类型" :labelCol="labelCol3" :wrapperCol="wrapperCol3" prop="payType">
             <j-dict-select-tag v-model="model.payType" dictCode="pay_type" placeholder="请选择"
               />
            </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="金额" :labelCol="labelCol3" :wrapperCol="wrapperCol3" prop="amount">
              <a-input-number v-model="model.amount" placeholder="请输入" :min="0" :step="0.01" :readOnly="disabled" />
            </a-form-model-item>
          </a-col>
         
        </a-row>
        <a-row>
           <a-col :span="8">
            <a-form-model-item label="用户" :labelCol="labelCol3" :wrapperCol="wrapperCol3" prop="user">
          <j-select-user-by-dep  v-model="model.user" :multi="false"
              @change="onOperatorChange" /> </a-form-model-item>
          </a-col>
          <a-col :span="8">
            <a-form-model-item label="支出日期" :labelCol="labelCol3" :wrapperCol="wrapperCol3" prop="payDate">
              <a-date-picker v-model="model.payDate" placeholder="请选择" :readOnly="disabled" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          
        </a-row>
      </a-form-model>
    </div>
  </a-spin>
</template>

<script>

// 暂时保留OrderFormMixin，因为它可能包含必要的功能
import { OrderFormMixin } from '../../common/mixins/OrderFormMixin'

export default {
  name: 'FinancialForm',
  mixins: [OrderFormMixin],
  components: {},
  computed: {
    labelCol3() {
      return { xs: { span: 24 }, sm: { span: 6 } };
    },
    wrapperCol3() {
      return { xs: { span: 24 }, sm: { span: 16 } };
    }
  },

  data() {
      return {
        confirmLoading: false,
        model: {
          id: '',
          companyName: "",
          amount: 0,
          user: "",
          payDate: null,
          remark: "",
          payType: ''
        },
        validatorRules: {
        companyName: [
          { required: true, message: '公司名称不能为空', trigger: 'blur' }
        ],
        amount: [
          { required: true, message: '金额不能为空', trigger: 'blur' },
          { type: 'number', min: 0, message: '金额必须大于等于0', trigger: 'blur' }
        ],
        user: [
          { required: true, message: '用户不能为空', trigger: 'blur' }
        ],
        payDate: [
          { required: true, message: '支出日期不能为空', trigger: 'change' }
        ]
      },
      url: {
        add: "/wr/financeOtherPay/add",
        edit: "/wr/financeOtherPay/edit"
      }
    }
  },

  methods: {
    // 重置表单
    resetForm() {
      this.$refs.form.resetFields();
    },
    
    // 表单验证
    validateForm() {
      return new Promise((resolve, reject) => {
        this.$refs.form.validate(valid => {
          if (valid) {
            console.log('财务新增的校验成功');
            resolve();
          } else {
            reject(new Error('表单验证失败'));
          }
        });
      });
    },
    
    // 获取表单数据
    getFormData() {
      return this.model;
    },
    
    // 设置表单数据（用于编辑操作）
    setFormValues(data) {
      this.model = { ...data };
      // 如果日期字段是字符串，转换为Date对象
      if (this.model.payDate && typeof this.model.payDate === 'string') {
        this.model.payDate = new Date(this.model.payDate);
      }
    },
    
    // 新增前的准备
    addBefore() {
      this.resetForm();
    },
    
    // 编辑后的处理
    editAfter() {
      // 编辑时数据已通过父组件传入，这里可以做一些额外的处理
    }
  }
}
</script>

<style lang="less" scoped>
@import "../../common/less/BillForm.less";
</style>
